<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Rentpad Invitees</title>
        <style>
            a {color:#404042;text-decoration:none;}      /* unvisited link */
            a:visited {color:#404042;}  /* visited link */
            a:hover {color:#404042;}  /* mouse over link */
            a:active {color:#404042;}  /* selected link */
            @font-face
            {
            font-family: avant;
            src: url('${model.props.appPath}/fonts/avangmi-webfont.ttf');
            }
        </style>
        <script type="text/javascript" src="js/jquery/jquery-1.8.3.min.js"></script>
        <script type="text/javascript" src="js/token/jquery.tokeninput.js"></script>  
        <script type="text/javascript">
            $(function() {
                $("#table-leads tr:even").css("background-color", "#eaeaea");
            });                   
        </script>
    </head>

    <body style="text-align: center; background-color: #FAFAFA; color: #404042; font-family: avant, Century Gothic, Calibri, Verdana; padding: 0px; margin: 0px;">                

        <div style="margin-top: 0px; background-color: white;">

            <%@include file="header.jsp" %>

            <div style="width: 100%; text-align: left; font-family: avant, Century Gothic, Calibri, Verdana; color: #404042; background-color: white; background: url('${model.props.appPath}/img/content-bg-short.jpg'); background-repeat: repeat-x; display: block; position: relative; top: -2px;">

                <div style="width: 90%; margin-top: 10px; margin: 0 auto;">

                    <br>
                    
                    <h1>Leads</h1>
                    
                    <table id="table-leads" border="" cellpadding="10" cellspacing="10" style="width:100%; border-collapse: collapse; font-size: 13px;">
                        <tr>
                            <th align="center">Date</th>
                            <th align="center">Name</th>
                            <th align="center">Email</th>
                            <th align="center">Phone</th>
                            <th align="center">Term</th>
                            <th align="center">Type</th>
                            <th align="center">City</th>
                            <th align="center">Beds</th>
                            <th align="center">Price</th>
                            <th align="center">Description</th>
                        </tr>
                        <c:forEach items="${model.leads}" var="lead">
                            <tr>
                                <td align="center"><fmt:formatDate pattern="yyyy-MM-dd hh:mm:ss" value="${lead.dateCreated}" /></td>
                                <td align="center">${lead.name}</td>
                                <td align="center">${lead.email}</td>
                                <td align="center">${lead.phone}</td>
                                <td align="center">${lead.term}</td>
                                <td align="center">${lead.type}</td>
                                <td align="center">${lead.city}</td>
                                <td align="center">${lead.bedsMin}</td>
                                <td align="center">${lead.priceMin} &mdash; ${lead.priceMax}</td>
                                <td align="left">${lead.description}</td>
                            </tr>
                            <tr>
                                <td colspan='10'></td>
                            </tr>
                        </c:forEach>
                    </table>

                </div>

                <br><br>                

            </div>

            <div>                
                <%@include file="footer.jsp" %>
            </div>

        </div>

    </body>
    
</html>
